<div class="modal fade settings-modal right" id="settings-modal" data-backdrop="static"  aria-labelledby="用户中心" data-keyboard="true" tabindex="-1">
    <div class="modal-dialog modal-lg modal-dialog-centered">
        <div class="modal-content mx-auto">
            <!-- 模态框标题栏 -->
            <div class="modal-header d-flex flex-column">
                <div>
                    <!-- outline: none !important; 去掉焦点边框 -->
                    <button type="button" class="close position-fixed" style="top: 5px; left: -40px; outline: none !important;" data-dismiss="modal" aria-label="关闭">
                        <span>&times;</span>
                    </button>
                    <h4 class="modal-title font-weight-bold">用户中心</h4>
                </div>
                <div class="w-100 mt-3">
                    <!-- text-muted 提示变灰 -->
                    <div class="shortcut-hint text-muted" style="font-size: 14px; margin-top: 30px;">📢 按 <kbd>Ctrl</kbd> + <kbd>Q</kbd> 可打开/关闭设置</div>
                    <hr class="mb-3 mt-2" />
                    <div class="col-12">
                        <div class="row no-gutters text-center">
                            <div class="col-4">
                                <span id="siteCount" class="font-weight-bold">NA</span>
                                <small class="d-block">
                                    <i class="fas fa-bookmark mr-1"></i>收录站点
                                </small>
                            </div>
                            <div class="col-4">
                                <span id="visitorCount" class="font-weight-bold">NA</span>
                                <small class="d-block">
                                    <i class="fab fa-hotjar mr-1"></i>访客统计
                                </small>
                            </div>
                            <div class="col-4">
                                <span id="operatingDaysCount" class="font-weight-bold">NA</span>
                                <small class="d-block">
                                    <i class="fas fa-chart-line mr-1"></i>运营天数
                                </small>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!-- 模态框标题栏 end-->

            <!-- 选项卡导航 -->
            <ul class="nav nav-tabs modal-header" id="settingsTabs">
                <li class="nav-item">
                    <a class="nav-link page-color" data-toggle="tab" href="#page-color" style="border: none; background-color: transparent;">风格</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link active user-settings" data-toggle="tab" href="#user-settings" style="border: none; background-color: transparent; border-bottom: 2px solid #ff0000;">设置</a>
                </li>
            </ul>
            <!-- 选项卡导航 end -->

            <!-- 模态框内容 -->
            <div class="modal-body" style="width: 400px; max-width: 100%">
                <!-- 选项卡内容 -->
                <div class="tab-content">
                    {{ partial "settings/base-settings.html" . }}
                    {{ partial "settings/color-theme.html" . }}
                </div>
                <!-- 选项卡内容 end -->
            </div>
            <!-- 模态框内容 end -->
        </div>
    </div>
</div>